<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    .chart{
      width: 800px;
      height: 300px;
      background-color: gray;
    }
  </style>
</head>
<body>
  <svg class="chart">
    <!-- <line x1="100" y1="100" x2="200" y2="200" stroke="#000"></line>
    <line x1="150" y1="50" x2="200" y2="200" style="stroke: pink;"></line>
    <line x1="50" y1="150" x2="250" y2="250" stroke="yellowgreen"></line> -->

    <!-- <polyline points="300 100, 400 200, 500 100, 300 100" fill="none" stroke="#000"></polyline> -->

    <!-- <polygon points="300 100, 400 200, 500 100" fill="none" stroke="#000"></polygon> -->

    <!-- <rect x="200" y="100" width="200" height="100" fill="none" stroke="#000"></rect> -->
    
    <!-- <circle cx="200" cy="200" r="50" fill="none" stroke="#000"></circle> -->

    <!-- <ellipse cx="500" cy="200" rx="100" ry="50" fill="none" stroke="#000"></ellipse> -->
  
    <path d="
      M 100 100
      L 300 100
      L 150 300
      L 200 20
      L 250 300
      Z
      "
      fill="none" 
      stroke="#000"
    ></path>
  </svg>


  <svg viewBox="0 0 1024 1024" width="20" height="20">
    <path 
      d="M512 836.266667C230.4 836.266667 74.666667 533.333333 68.266667 520.533333c-4.266667-8.533333-4.266667-19.2 0-29.866666 6.4-12.8 164.266667-315.733333 443.733333-315.733334 281.6 0 437.333333 305.066667 443.733333 317.866667 4.266667 8.533333 4.266667 19.2 0 29.866667-6.4 10.666667-162.133333 313.6-443.733333 313.6zM132.266667 505.6c34.133333 57.6 170.666667 266.666667 379.733333 266.666667s345.6-209.066667 379.733333-266.666667c-34.133333-57.6-170.666667-266.666667-379.733333-266.666667S166.4 448 132.266667 505.6z" p-id="3021" fill="#707070"></path><path d="M512 650.666667c-76.8 0-138.666667-61.866667-138.666667-138.666667s61.866667-138.666667 138.666667-138.666667 138.666667 61.866667 138.666667 138.666667-61.866667 138.666667-138.666667 138.666667z m0-213.333334c-40.533333 0-74.666667 34.133333-74.666667 74.666667s34.133333 74.666667 74.666667 74.666667 74.666667-34.133333 74.666667-74.666667-34.133333-74.666667-74.666667-74.666667z" 
      fill="#707070"
    ></path>
  </svg>
</body>
</html>